<template>
	<div class="lm-chatgpt-item">
		<chatgpt-item-header  v-if="!isChat" :text="'正在为您生成结果：' + item.message.title"></chatgpt-item-header>
		<div class="chatgpt-item-content">
			<div class="item-section-title">{{item.message.title}}</div>
			<video :src="item.message.url" controls class="video"></video>
			<div  v-if="!isChat" class="bottom-ope">
				<h-button type="info" @click="postMessage" class="btn">转发</h-button>
			</div>
		</div>
	</div>
</template>

<script>
import ChatgptItemHeader from './chatgpt-item-header'
import { mapState, mapMutations, mapActions } from "vuex"
export default {
	name: 'VideoCardItem',
	props: {
		item: Object,
		isChat: {
			type: Boolean,
			default: false
		}
	},
	components: {
		ChatgptItemHeader
	},
	data() {
		return {
		}
	},
	computed: {
	},
	methods: {
		...mapActions('lm-chat', ['postMsg']),
		// 发送
		postMessage() {
			this.postMsg({
				msg_side: "1",
				aicc_msg_type: "videoCard",
				aicc_msg_content: {
					title: this.item.message.title,
					url: this.item.message.url
				}
			})
		},
	}
}
</script>

<style lang="scss" scoped>
.lm-chatgpt-item{
	display: inline-block;
	.chatgpt-item-content{
		box-shadow: 0px 0px 8px 0px rgba(152,176,214,0.19);
		.item-section-title{
			margin-bottom: 12px;
		}
		video{
			width: 238px;
			border-radius: 8px;
		}
		.bottom-ope{
			text-align: right;
			margin-top: 16px;
			.btn{
				border-radius: 4px;
			}
		}
	}
}
</style>